import { ref } from "vue"
import * as echarts from "echarts"
import getMap from "@/data/map"

export function china() {
    let map = getMap("china")
    if (map != null) {
        echarts.registerMap("china", map)

        let data = [
            {
                name: "北京",
                value: [116.24, 39.55, 100],
            },
            {
                name: "深圳",
                value: [114.271522, 22.753644],
            },

            {
                name: "重庆",
                value: [106.54, 29.59],
            },
            {
                name: "浙江",
                value: [120.19, 30.26],
            },
            {
                name: "上海",
                value: [121.4648, 31.2891],
            },
        ]
        let LableData = [
            {
                name: "北京",
                coords: [
                    [116.24, 39.55, 100],
                    [120.24, 46.55, 100],
                ], // 线条位置[开始位置，结束位置]
                value: [1021, 120],
            },
            {
                name: "深圳",
                coords: [
                    [114.271522, 22.753644],
                    [118.24, 18.55, 100],
                ], // 线条位置[开始位置，结束位置]
                value: [1021, 120],
            },
            {
                name: "重庆",
                coords: [
                    [106.54, 29.59],
                    [104.24, 35.55],
                ], // 线条位置[开始位置，结束位置]
                value: [1021, 120],
            },
            {
                name: "浙江",
                coords: [
                    [120.19, 30.26],
                    [125.24, 27.55, 100],
                ], // 线条位置[开始位置，结束位置]
                value: [1021, 120],
            },
            {
                name: "上海",
                coords: [
                    [121.4648, 31.2891],
                    [122.4648, 32.2891],
                ], // 线条位置[开始位置，结束位置]
                value: [1201, 60],
            },
        ]
        const option = ref({
            /*backgroundColor: '#000f1e',*/
            geo: {
                map: "china",
                aspectScale: 0.85,
                layoutCenter: ["50%", "50%"], //地图位置
                layoutSize: "100%",
                itemStyle: {
                    normal: {
                        shadowColor: "#276fce",
                        shadowOffsetX: 0,
                        shadowOffsetY: 15,
                        opacity: 0.5,
                    },
                    emphasis: {
                        areaColor: "#276fce",
                    },
                },
                regions: [
                    {
                        name: "南海诸岛",
                        itemStyle: {
                            areaColor: "rgba(0, 10, 52, 1)",

                            borderColor: "rgba(0, 10, 52, 1)",
                            normal: {
                                opacity: 0,
                                label: {
                                    show: false,
                                    color: "#009cc9",
                                },
                            },
                        },
                        label: {
                            show: false,
                            color: "#FFFFFF",
                            fontSize: 12,
                        },
                    },
                ],
            },
            series: [
                // 常规地图
                {
                    type: "map",
                    mapType: "china",
                    aspectScale: 0.85,
                    layoutCenter: ["50%", "50%"], //地图位置
                    layoutSize: "100%",
                    zoom: 1, //当前视角的缩放比例
                    // roam: true, //是否开启平游或缩放
                    scaleLimit: {
                        //滚轮缩放的极限控制
                        min: 1,
                        max: 2,
                    },
                    itemStyle: {
                        normal: {
                            areaColor: "#0c274b",
                            borderColor: "#1cccff",
                            borderWidth: 1.5,
                        },
                        emphasis: {
                            areaColor: "#02102b",
                            label: {
                                color: "#fff",
                            },
                        },
                    },
                },
                // 区域散点图
                {
                    type: "effectScatter",
                    coordinateSystem: "geo",
                    zlevel: 2,
                    symbolSize: 10,
                    rippleEffect: {
                        //坐标点动画
                        period: 3,
                        scale: 5,
                        brushType: "fill",
                    },
                    label: {
                        normal: {
                            show: true,
                            position: "right",
                            formatter: "{b}",
                            color: "#b3e2f2",
                            fontWeight: "bold",
                            fontSize: 16,
                        },
                    },

                    data: data,
                    itemStyle: {
                        //坐标点颜色
                        normal: {
                            show: true,
                            color: "#ff8003",
                            shadowBlur: 20,
                            shadowColor: "#fff",
                        },
                        emphasis: {
                            areaColor: "#f00",
                        },
                    },
                },
                {
                    type: "lines",
                    zlevel: 3,
                    symbol: "circle",
                    symbolSize: [5, 5],
                    color: "#ff8003",
                    opacity: 1,
                    label: {
                        show: true,
                        padding: [10, 20],
                        color: "#fff",
                        backgroundColor: "#1a3961",
                        borderColor: "#aee9fb",
                        borderWidth: 1,
                        borderRadius: 6,
                        formatter(params) {
                            let arr = [
                                params.name,
                                "废水污染：" + params.value[1] + "家",
                                "废气污染：" + params.value[0] + "家",
                            ]
                            return arr.join("\n")
                        },
                        textStyle: {
                            align: "left",
                            lineHeight: 20,
                        },
                    },
                    lineStyle: {
                        type: "solid",
                        color: "#fff",
                        width: 0.5,
                        opacity: 1,
                    },
                    data: LableData,
                },
            ],
        })

        return option
    }
}

export function hezhou() {
    let map = getMap("hezhou")
    if (map != null) {
        echarts.registerMap("hezhou", map)

        let data = [
            {
                name: "八步区",
                value: [111.71, 24.31],
            },
            {
                name: "富川瑶族自治县",
                value: [111.31, 24.91],
            },
            {
                name: "昭平县",
                value: [110.98, 24.08],
            },
            {
                name: "钟山县",
                value: [111.25, 24.51],
            },
        ]
        let LableData = [
            {
                name: "八步区",
                coords: [
                    [111.71, 24.31],
                    [111.65, 24.21],
                ], // 线条位置[开始位置，结束位置]
                value: [1021, 120],
            },
            {
                name: "富川瑶族自治县",
                coords: [
                    [111.31, 24.91],
                    [110.68, 24.72],
                ], // 线条位置[开始位置，结束位置]
                value: [1021, 120],
            },
            {
                name: "昭平县",
                coords: [
                    [110.98, 24.08],
                    [110.56, 24.35],
                ], // 线条位置[开始位置，结束位置]
                value: [1021, 120],
            },
            {
                name: "钟山县",
                coords: [
                    [111.25, 24.51],
                    [111.55, 24.65],
                ], // 线条位置[开始位置，结束位置]
                value: [1021, 120],
            },
        ]
        const option = ref({
            /*backgroundColor: '#000f1e',*/
            geo: {
                map: "hezhou",
                aspectScale: 0.85,
                layoutCenter: ["50%", "50%"], //地图位置
                layoutSize: "100%",
                itemStyle: {
                    normal: {
                        shadowColor: "#276fce",
                        shadowOffsetX: 0,
                        shadowOffsetY: 15,
                        opacity: 0.5,
                    },
                    emphasis: {
                        areaColor: "#276fce",
                    },
                },
                // regions: [
                //     // {
                //     //     name: "南海诸岛",
                //     //     itemStyle: {
                //     //         areaColor: "rgba(0, 10, 52, 1)",
                //     //         borderColor: "rgba(0, 10, 52, 1)",
                //     //         normal: {
                //     //             opacity: 0,
                //     //             label: {
                //     //                 show: false,
                //     //                 color: "#009cc9",
                //     //             },
                //     //         },
                //     //     },
                //     //     label: {
                //     //         show: false,
                //     //         color: "#FFFFFF",
                //     //         fontSize: 12,
                //     //     },
                //     // },
                // ],
            },
            series: [
                // 常规地图
                {
                    type: "map",
                    mapType: "hezhou",
                    aspectScale: 0.85,
                    layoutCenter: ["50%", "50%"], //地图位置
                    layoutSize: "100%",
                    zoom: 1, //当前视角的缩放比例
                    // roam: true, //是否开启平游或缩放
                    scaleLimit: {
                        //滚轮缩放的极限控制
                        min: 1,
                        max: 2,
                    },
                    itemStyle: {
                        normal: {
                            areaColor: "#0c274b",
                            borderColor: "#1cccff",
                            borderWidth: 1.5,
                        },
                        emphasis: {
                            areaColor: "#02102b",
                            label: {
                                color: "#fff",
                            },
                        },
                    },
                },
                // 区域散点图
                {
                    type: "effectScatter",
                    coordinateSystem: "geo",
                    zlevel: 2,
                    symbolSize: 10,
                    rippleEffect: {
                        //坐标点动画
                        period: 3,
                        scale: 5,
                        brushType: "fill",
                    },
                    label: {
                        normal: {
                            show: true,
                            position: "right",
                            formatter: "{b}",
                            color: "#b3e2f2",
                            fontWeight: "bold",
                            fontSize: 16,
                        },
                    },

                    data: data,
                    itemStyle: {
                        //坐标点颜色
                        normal: {
                            show: true,
                            color: "#ff8003",
                            shadowBlur: 20,
                            shadowColor: "#fff",
                        },
                        emphasis: {
                            areaColor: "#f00",
                        },
                    },
                },
                {
                    type: "lines",
                    zlevel: 3,
                    symbol: "circle",
                    symbolSize: [5, 5],
                    color: "#ff8003",
                    opacity: 1,
                    label: {
                        show: true,
                        padding: [10, 20],
                        color: "#fff",
                        backgroundColor: "#1a3961",
                        borderColor: "#aee9fb",
                        borderWidth: 1,
                        borderRadius: 6,
                        formatter(params) {
                            let arr = [
                                params.name,
                                "入院：" + params.value[1] + " 人",
                                "出院：" + params.value[0] + " 人",
                            ]
                            return arr.join("\n")
                        },
                        textStyle: {
                            align: "left",
                            lineHeight: 20,
                        },
                    },
                    lineStyle: {
                        type: "solid",
                        color: "#fff",
                        width: 0.5,
                        opacity: 1,
                    },
                    data: LableData,
                },
            ],
        })

        return option
    }
}
